import { useIntersectionObserver } from '@vueuse/core'

export default {
  // 图片懒加载：在用户无法看到图片时，不加载图片，用户可以看到图片时再去加载图片
  mounted(el) {
    const imgSrc = el.src
    el.src = ''
    const {stop} = useIntersectionObserver(el,([{isIntersecting}]) => {
      if (isIntersecting) {
        // 当图片可见时加载图片
        el.src = imgSrc
        stop()
      }
    })
  }
}
